When using chrome to access the JS Library of a third party, a warning will appear on the console:
A Parser-blocking, cross-origin script, https://example.com/script.js , is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.
cause analysis:
In a weak network connection environment, such as 2G network, using document. Write() to dynamically insert external scripts on a page will block page parsing, delay page display, and even fail to load scripts, eventually leading to incorrect page display
under what conditions should such a warning appear:
In order to improve the user experience, chrome uses
& lt; script>
will check. When all the following conditions are met, chrome will not load& lt; script>
1. Users are in the environment of weak network connection, especially 2G network
2. Document. Write () is on the main page, which has no effect on the pages embedded in the iframe
3. The script inserted in document. Write () is parser blocking. If the
& lt; script>
tag with 'async' or 'defer' attribute, the script will be loaded asynchronously, which does not affect parsing, so it can also be executed4. The loaded script and site are not the same domain name
5. The script is not in the browser's cache
6. The page is not reloaded, starting from chrome 53. For the code that meets the 2-5 condition, the console will output the warning in the problem:
A Parser-blocking, cross-origin script, https://example.com/script.js , is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity.
solution:
1. The best way is not to use
document. Write()
to load scripts dynamically2. If you must use
document. Write()
to load scripts, use asynchronous loading methods, such as& lt; scriptsrc="..."async>
or use DOM APIelement. Appendchild()
Similar Posts:
- ”Cannot read property ‘addEventListener’ of null“
- Uncaught DOMException: Blocked a frame with origin “null” from accessing a cross-origin…
- Chrome Commands Error: “Slow network is detected. Fallback font will be used while loading”
- Solution to the problem of missing URI path in chrome 85 + referer
- The Difference between $(document).ready, window.onload and $(window).load(function (){})
- Error in JS function referencing public page [How to Solve]
- Document.body.clientheight cannot get the browser page height correctly
- [Chrome Error] Cross origin requests are only supported for protocol schemes: http, data,chrome-extension
- document.body.scrollTop or document.documentElement.scrollTop
- Always report uncaught error:[$ injector:modulerr ]Solutions to errors