nodejs搭建当地服务器轻易消除跨域难点,Windows下火速搭建NodeJS本地服务器的手续

By admin in web前端 on 2019年6月11日

本文介绍了Windows下火速搭建NodeJS本地服务器的手续,分享给大家,具体如下:

node.jpg

近些日子把原先用jquery写的三个小demo拿出来运转的,刚发轫的时候忘了敞开本地服务变成调控台一直报XMLHttpRequest
cannot load
}.
Cross origin requests are only supported for protocol schemes: http,
data, chrome, chrome-extension, https.. 克罗丝 origin requests are only
supported for protocol schemes: http, data, chrome, chrome-extension,
https,
chrome-extension-resource.然后小编就去运转自身写的server.js服务器,在那进度中,以为这种艺术挺费力的,就平素去尝尝了其余的措施如何去改浏览器属性等都试过领会而都未有缓和跨域难点,最后得出二种有效措施,在那边自身就把那两种格局共同介绍大家。

web前端 1

先是大家要到Node.js官方网站下载对应版本的安装包

一、使用 Node 创建 Web 服务器

率先大家要到Node.js官方网址下载对应版本的安装包

http://nodejs.cn/download/

注:Node.js 提供了 http 模块,http 模块首要用以搭建 HTTP
服务端和客户端,下边正是轻便的服务器完毕进程:

nodejs.png

一、编写服务器代码server.js

web前端 2

接着正是安装,和设置普通软件临近,直接下一步下一步就足以了。

var http = require('http'); 
var fs = require('fs');//引入文件读取模块 
var documentRoot = 'C:/Users/79883/Desktop/jquery/ajax';//需要访问的文件的存放目录 
var server= http.createServer(function(req,res){ 
  //客户端输入的url,例如如果输入localhost:8888/index.html 
 //那么这里的url == /index.html 
 var url = req.url; 
 var file = documentRoot + url; 
 console.log(url); 
 fs.readFile( file , function(err,data){ 
 /* 
  一参为文件路径 
  二参为回调函数 
   回调函数的一参为读取错误返回的信息,返回空就没有错误 
   二参为读取成功返回的文本内容 
 */ 
  if(err){ 
   //HTTP 状态码 404 : NOT FOUND 
   //Content Type:text/plain 
   res.writeHeader(404,{ 
    'content-type' : 'text/html;charset="utf-8"' 
   }); 
   res.write('<h1>404错误</h1><p>你要找的页面不存在</p>'); 
   res.end(); 
  }else{ 
   //HTTP 状态码 200 : OK 
   //Content Type:text/plain 
   res.writeHeader(200,{ 
    'content-type' : 'text/html;charset="utf-8"' 
   }); 
   res.write(data);//将index.html显示在客户端 
   res.end(); 
  } 
 }); 
}).listen(8888); 
console.log('服务器开启成功'); 

接着正是安装,和安装普通软件临近,直接下一步下一步就足以了。

此后大家来注解node是或不是安装成功,Win+哈弗输入cmd来调出调节台并输入node -vnpm -v来查看node版本和npm(包处理工科具)版本。

透过地点代码,大家就可见落到实处服务器对于文本的搜寻,上边,大家就进行创办一个html文件,然后经过浏览器实行走访。

日后我们来证实node是否安装成功,Win+Tiggo输入cmd来调出调整台并输入node
-v和npm -v来查阅node版本和npm(包管理工具)版本。

node.png

二、编写html文件(index.html),用于浏览器实行呼吁

web前端 3

接着我们来创设一个server.js文件,并将上边包车型地铁代码粘贴上去

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>index</title> 
</head> 
<body> 
 这是一个用于进行nodejs服务器测试的html文件,通过在浏览器上面输入 
 http://127.0.0.1:8888/index.html(自己所建的项目名)进行访问 
</body> 
</html> 

紧接着我们来创建三个server.js文件,并将上面包车型客车代码粘贴上去

var http = require('http');
var fs = require('fs');//引入文件读取模块

var documentRoot = 'I:/WebServer';
//需要访问的文件的存放目录

var server= http.createServer(function(req,res){

    var url = req.url; 
    //客户端输入的url,例如如果输入localhost:8888/index.html
    //那么这里的url == /index.html 

    var file = documentRoot + url;
    console.log(url);

    fs.readFile( file , function(err,data){
    /*
        err为文件路径
        data为回调函数
            回调函数的一参为读取错误返回的信息,返回空就没有错误
            data为读取成功返回的文本内容
    */
        if(err){
            res.writeHeader(404,{
                'content-type' : 'text/html;charset="utf-8"'
            });
            res.write('<h1>404错误</h1><p>你要找的页面不存在</p>');
            res.end();
        }else{
            res.writeHeader(200,{
                'content-type' : 'text/html;charset="utf-8"'
            });
            res.write(data);//将index.html显示在客户端
            res.end();

        }

    });

}).listen(8888);

console.log('服务器开启成功');

三、进行测试

var http = require('http');
var fs = require('fs');//引入文件读取模块

var documentRoot = 'I:/WebServer';
//需要访问的文件的存放目录

var server= http.createServer(function(req,res){

 var url = req.url; 
 //客户端输入的url,例如如果输入localhost:8888/index.html
 //那么这里的url == /index.html 

 var file = documentRoot + url;
 console.log(url);

 fs.readFile( file , function(err,data){
 /*
  err为文件路径
  data为回调函数
   回调函数的一参为读取错误返回的信息,返回空就没有错误
   data为读取成功返回的文本内容
 */
  if(err){
   res.writeHeader(404,{
    'content-type' : 'text/html;charset="utf-8"'
   });
   res.write('<h1>404错误</h1><p>你要找的页面不存在</p>');
   res.end();
  }else{
   res.writeHeader(200,{
    'content-type' : 'text/html;charset="utf-8"'
   });
   res.write(data);//将index.html显示在客户端
   res.end();

  }

 });

}).listen(8888);

console.log('服务器开启成功');

为便宜打开服务器调节和测试网址,大家创设三个站点目录来存放在node.js文件和网址文件

    (1) 首先大家运营服务器,张开cmd,找到项目所在地方,然后输入指令node
server.js运营服务器

为便宜张开服务器调节和测试网址,大家创制一个站点目录来存放node.js文件和网站文件

webserver.png

    (二) 在浏览器举行走访,在url栏中输入

web前端 4

从此现在大家就可以透过垄断台来开启服务器了

1经对应页面呈现出来就印证你成功了。接下来笔者将介绍nodejs飞快搭建本地服务,也正是自个儿说的第二种方法。

而后我们就足以因此垄断台来展开服务器了

nod.png

web前端,2、使用nodejs神速搭建当地服务

web前端 5

浏览器输入http://localhost:8888/index.html

注:node.js
的anywhere便是随地随时将您的当前目录产生八个静态文件服务器的根目录

浏览器输入

nods.png

一、首先打开cmd,输入node
-v检验你鲜明你是还是不是安装好了node.js,然后输入指令npm install angwhere
-g,举办设置静态文件服务器,安装完如下图展现:

web前端 6

就是这般轻松,咱们赶紧去搭建自身的NodeJS本地服务器吧!

web前端 7

正是如此轻松,大家连忙去搭建自个儿的NodeJS本地服务器吧!

二、在cmd页面 找到你想搭建服务器的不2诀窍

上述正是本文的全体内容,希望对我们的就学抱有支持,也盼望我们多多扶助脚本之家。

3、然后再当前路径下输入: anywhere 888八  如下图显示

您或然感兴趣的稿子:

  • 三分钟急迅搭建nodejs本地服务器方法运营测试html/js
  • nodejs搭建本地服务器并走访文件的办法

web前端 8

肆、回车的前边,浏览器就活动张开本地访问网站,1个粗略的node服务器就像此被我们搭建好啊!

总结

如上所述是作者给我们介绍的nodejs搭建本地服务器轻易消除跨域难题,希望对大家全体支持,借使大家有其余疑问请给本身留言,小编会及时过来大家的。在此也特别多谢大家对剧本之家网址的协理!

你大概感兴趣的文章:

  • nodeJS(express四.x)+vue(vue-cli)营造前后端分离实例(带跨域)
  • Windows下连忙搭建NodeJS本地服务器的步子
  • 3分钟快捷搭建nodejs本地服务器方法运维测试html/js
  • nodejs搭建本地服务器并走访文件的不2诀窍

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图
Copyright @ 2010-2019 澳门新葡亰官网app 版权所有