对于Node.js新手，搭建一个静态资源服务器是个不错的锻炼，从最简单的返回文件或错误开始，渐进增强，还可以逐步加深对http的理解。那就开始吧，让我们的双手沾满网络请求！ Note: 当然在项目中如果有使用express框架，用express.static一行代码就可以达到目的了： app.use(express.static(public))这里我们要实现的正是express.static背后所做工作的一部分，建议同步阅读该模块源码。 基本功能不急着写下第一行代码，而是先梳理一...
直接打开html文件，是以file:///方式打开的，这种方式很多时候会遇到跨域的问题，因此我们一般会搭建一个简易的本地服务器，来运行测试页面。 一、构建静态服务器 1、使用express模块 建立个js文件，命名server，内容代码如下： var express = require(express); var app = express(); var path = require(path);//指定静态资源访问目录 app.use(express.static(require(path).join(__dirname, public))); // app.use(express.stat...
webpack系列目录webpack 系列 二：webpack 介绍&安装 webpack 系列 三：webpack 如何集成第三方js库 webpack 系列 四：webpack 多页面支持 & 公共组件单独打包 webpack 系列 五：webpack Loaders 模块加载器webpack 系列 六：前端项目模板-webpack+gulp实现自动构建部署 基于webpack搭建纯静态页面型前端工程解决方案模板， 最终形态源码见github: https://github.com/ifengkou/webpack-template 正文 Webpack将所有静态资源都认为...
前言 刚开始用Nodejs写简单的web服务器的时候，总是感觉少了点什么。 原来，我一直是在页面上输出什么Hello World！啊， It Works.之类的了。还确实没有处理关于CSS， JS这些引用的静态相关的资源。 一开始觉得处理这些东西应该会非常的easy，结果发现不仅仅是这么回事。途中也遇到了一些人们经常可能会犯的想当然的错误。于是我就决定好好的记录一下关于Nodejs中对于静态资源的处理。 着眼于问题 重现问题 先来展示一下目录结构吧...
tomcat服务器提供的接口，不能在其他域中访问的时候，需要增 Access-Control-Allow-Origin:* 以下操作均在需要被访问的项目中设置 1、编写拦截器代码package com.soft.filter; /*** Created by Administrator on 2017/2/6.*/ import javax.servlet.*; import javax.servlet.http.HttpServletResponse; import java.io.IOException; public class CORSFilter implements Filter {@Overridepublic void init(FilterConfig filterConf...
由于同源策略的缘故，ajax不能向不同域的网站发出请求。 比如a站localhost需要向b站请求数据，地址为：http://www.walk-sing.com/api.php 请求的代码如下： <html> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <script type="text/javascript"> $.get("http://www.walk-sing.com/api.php", function(data){ alert("Data Loaded: " + data); }); </script> <body> </body> </html> 访问该页面，页...
跨域请求资源的几种方式，具体如下：1.什么是跨域2.JSONP3.proxy代理4.cors5.xdr由于浏览器同源策略，凡是发送请求url的协议、域名、端口三者之间任意一与当前页面地址不同即为跨域。具体可以查看下表JSONP这种方式主要是通过动态插入一个script标签。浏览器对script的资源引用没有同源限制，同时资源加载到页面后会立即执行（没有阻塞的情况下）。 <script>var _script = document.createElement(script);_script.type = "text/ja...
本文详细介绍了javascript跨域资源共享，供大家参考，具体内容如下 1.为什么提出跨域资源共享(CORS)? 因为XHR实现ajax的安全限制是：XHR 对象只能访问与包含它的页面位于同一个域中的资源2.如何实现跨域？（跨浏览器） // 跨浏览器创建并返回CORS对象// param method : 请求的方式, get or post// param url : 跨域请求的url// return xhr : 返回的跨域资源对象function createCORSRequest(method, url){var xhr = new XMLHttp...
它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。 本文详细介绍CORS的内部机制。（图片说明：摄于阿联酋艾因（Al Ain）的绿洲公园） 一、简介 CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。 整个CORS通信过程，都是浏览器自动完成，不需要用户参与。对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全一样。浏览器一旦发现AJAX请求跨源...
资源预加载组件——preload 队列，可以支持队列加载和回调，也可以加载视频或者音频进度条，可以动态获取进度条信息支持img标签的预加载，添加pSrc属性即可原生ES5demoInstall：git clone https://github.com/jayZOU/preload.git npm install npm run es6 访问http://localhost:8080/es6-demo Examples<audio pSrc="../public/audio/a.mp3" preload="auto" controls></audio><audio pSrc="../public/audio/b.mp3" preload="auto" c...
本文实例讲述了javascript实现动态导入js与css等静态资源文件的方法。分享给大家供大家参考。具体实现方法如下： /*** 动态导入静态资源文件js/css*/ var $import = function(){return function(rId, res, callback){if(res && string == typeof res){if(rId){if($($(# + rId), $(head)).length>0){return;}}//加载资源文件var sType = res.substring(res.lastIndexOf(.) + 1);// 支持js/cssif(sType && (js == sType || css == sT...
“JavaScript”的名头相信大家肯定是耳熟能详，但只有一小部分人群了解它的使用与应用程序构建方式。这“一小部分”人指的当然是技术过硬的有为青年、网络程序员以及IT专业人员。但对于一位新手或者说外行人而言，“JavaScript”只不过是复杂计算机编程学科当中的另一个不知所云的术语。 那么，JavaScript到底是什么？ 如果各位拥有在计算机领域的工作经验，那么绝对不能错过强大的JavaScript。它是知名度最高的Web页面脚本语言。它...
在IE6/7里JavaScript会从两个方面阻碍页面呈现： script标签下面的网页资源在script加载完之前会停止请求、下载。 script标签下面的html元素在script加载完之前会停止渲染。 在ie6/7 firefox2/3 Safari3 Chrome1 和 opera下 script标签会阻碍下载：虽然在ie8，safari4，chrome2下script可以并发，但依然阻碍了其他资源的下载：有6种方法可以使script与其他资源并行下载： 1.XHR eval — 通过XHR(XMLHttpRequest 对象)下载script，然...
login.html 代码如下:<script> function request(id,url){ oScript = document.getElementById(id); var head = document.getElementsByTagName("head").item(0); if (oScript) { head.removeChild(oScript); } oScript = document.createElement("script"); oScript.setAttribute("src", url); oScript.setAttribute("id",id); oScript.setAttribute("type","text/javascript"); oScr...
在学习网页中的表单验证，顺便学习下正则表达式 在网上找了后发现了一个比较齐全的资源，稍微进行了一下排版 代码如下:// 检查是否为有效的真实姓名，只能含有中文或大写的英文字母 function isValidTrueName(strName){ var str = Trim(strName); //判断是否为全英文大写或全中文，可以包含空格 var reg = /^[A-Z u4E00-u9FA5]+$/; if(reg.test(str)){ return false; } return true; } JavaScript表单验证年龄 JavaScript表单验证...