精华内容
下载资源
问答
  • const port = 8080; app.listen(port, () => { console.log('Express server listening on port ' + port); }); connection.js const MongoClient = require('mongodb').MongoClient; const assert = ...

    用nodejs+express封装自己的api,遇到跨域问题

    原本我是这样写进去的:

    //设置跨域访问
    app.all('*', function(req, res, next) {
        res.header("Access-Control-Allow-Origin", "*");
        res.header("Access-Control-Allow-Headers", "X-Requested-With");
        res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
        res.header("X-Powered-By",' 3.2.1')
        res.header("Content-Type", "application/json;charset=utf-8");
        next();
    });

    后来浏览器一直:

     

    解决方式:

     把上边的第二句换成:

        res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');

    完整代码:

    var express = require('express');
    var md5 = require('js-md5');
    var app = express();
    var bodyParser = require('body-parser');
    app.use(bodyParser.json({
      limit: '1mb'
    }));
    app.use(bodyParser.urlencoded({
      limit: '1mb',
      extended: true
    }));
    var DatabaseOperation = require('./connection');
    
    //引用bodyParser
    app.use(bodyParser.json());
    app.use(bodyParser.urlencoded({
      extended: true
    }));
    //设置跨域请求
    app.all('*', function (req, res, next) {
      res.header("Access-Control-Allow-Origin", "*");
      res.header('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
      res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
      res.header("X-Powered-By", ' 3.2.1')
      res.header("Content-Type", "application/json;charset=utf-8");
      next();
    });
    
    //用户注册
    app.get('/api/user/register', function (req, res) {
      DatabaseOperation.select('user', {
        "username": req.query.username,
      }, function (result) {
        if (result.length > 0) {
          result = {
            code: '1001'
          }
          res.json(result);
        } else {
          DatabaseOperation.insert('user', [{
            "username": req.query.username,
            "password": md5(req.query.password)
          }], function (result) {
            res.json(result)
          });
        }
      });
    });
    
    const port = 8080;
    app.listen(port, () => {
      console.log('Express server listening on port ' + port);
    });

    connection.js

    const MongoClient = require('mongodb').MongoClient;
    const assert = require('assert');
    var dataconfig = require('./dataconfig');
    var DatabaseOperation = {
      /*
      @selectall 方法返回全部所有数据
      @dataname 数据库名称
      @dealdata 回调处理函数 格式function(result){};
      */
      selectall: function (dataname, dealdata) {
        const client = new MongoClient(dataconfig.dataurl);
        client.connect(function (err) {
          assert.equal(null, err);
          console.log("数据库连接成功");
          const db = client.db(dataconfig.dataname);
          db.collection(dataname).find({}).toArray(function (err, result) { // 返回集合中所有数据
            if (err) throw err;
            dealdata(result);
          });
          client.close();
        })
      },
      /*
      @selectone 查询符合条件的数据
      @dataname 数据库名称
      @selectlanguage 查询控制语句 格式{index:value,index,value};
      @dealdata 回调处理函数 格式function(result){};
      */
      select: function (dataname, selectlanguage, dealdata) {
        const client = new MongoClient(dataconfig.dataurl);
        client.connect(function (err) {
          assert.equal(null, err);
          console.log("数据库连接成功");
          const db = client.db(dataconfig.dataname);
          db.collection(dataname).find(selectlanguage).toArray(function (err, docs) {
            console.log('find');
            dealdata(docs);
            client.close();
          });
        })
      },
      /*
      @insert添加数据格式json格式
      @dataname 数据库名称
      @dealdata 回调函数处理函数有一个result参数
      */
      insert: function (dataname, insertlanguage, dealdata) {
        const client = new MongoClient(dataconfig.dataurl);
        client.connect(function (err) {
          assert.equal(null, err);
          console.log("数据库连接成功");
          const db = client.db(dataconfig.dataname);
          db.collection(dataname).insertMany(insertlanguage, function (err, result) {
            assert.equal(err, null);
            dealdata(result);
            client.close();
          });
        })
      },
      /*
    @update 修改数据的方法
    @update添加数据格式json格式
    @dataname 数据库名称
    @dealdata 回调函数处理函数有一个result参数
    */
      update: function (dataname, updatelanguage, updatecondition, dealdata) {
        const client = new MongoClient(dataconfig.dataurl);
        client.connect(function (err) {
          assert.equal(null, err);
          console.log("数据库连接成功");
          const db = client.db(dataconfig.dataname);
          db.collection(dataname).updateOne(updatelanguage, updatecondition, function (err, result) {
            assert.equal(err, null);
            dealdata(result);
            client.close();
          });
        })
      },
      /*
      @removeall 删除数据的方法
      @dataname 数据库名称
      @removelanguage 删除数据的条件
      @dealdata 回调函数处理函数有一个result参数
      */
      removeall: function (dataname, removelanguage, dealdata) {
        const client = new MongoClient(dataconfig.dataurl);
        client.connect(function (err) {
          assert.equal(null, err);
          const db = client.db(dataconfig.dataname);
          db.collection(dataname).findAndRemove(removelanguage, function (err, result) {
            assert.equal(err, null);
            dealdata(result);
            client.close();
          });
        })
      },
    
    };
    
    // 测试用例
    // DatabaseOperation.selectall('address', function(result) {
    //         console.log("select查询结果");
    //         console.log(result);
    //     })
    // DatabaseOperation.select('address', {
    //     "addressid": "2"
    // }, function(result) {
    //     console.log("select查询结果");
    //     console.log(result);
    // });
    // DatabaseOperation.insert('address', [{
    //         "insert": "hello"
    //     }], function(result) {
    //         console.log('inserts插入结果');
    //         console.log(result);
    //     })
    // DatabaseOperation.removeall('note', {
    //     "id": "5ce177b965ee630c046266af"
    // }, function(result) {
    //     console.log(result);
    // })
    
    module.exports = DatabaseOperation;

     

    最后愉快地解决了!

    接下来了解一下响应头是什么(只说明上边的几个,其他自行了解):

    上边的设置,在前端请求后端接口的时候,就会用到:

     

    Access-Control-Allow-Headers:Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild :响应首部,用于预检请求中,代表将会在正式请求的Access-Control-Expose-Headers 字段中出现的首部信息。

    其中:

    Content-Type: 实体头部用于指示资源的MIME类型 media type 。

    在响应中,Content-Type标头告诉客户端实际返回的内容的内容类型。浏览器会在某些情况下进行MIME查找,并不一定遵循此标题的值; 为了防止这种行为,可以将标题 X-Content-Type-Options 设置为 nosnif

    Authorization :请求头含有服务器用于验证用户代理身份的凭证。

    Accept :请求头用来告知客户端可以处理的内容类型

    Access-Control-Allow-Origin:* : 响应头指定了该响应的资源是否被允许与给定的origin共享,对于不需具备凭证(credentials)的请求,服务器会以“*”作为通配符,从而允许所有域都具有访问资源的权限。或者也可以指定进行限制

    Content-Length :74 : 表明了实体主体部分的大小(单位是字节)

    Access-Control-Allow-Methods:PUT,POST,GET,DELETE,OPTIONS:服务器端允许的请求方式,常用get、post

    Date: 其中包含了报文创建的日期和时间。格式:

    Date: <day-name>, <day> <month> <year> <hour>:<minute>:<second> GMT

    <day-name>

    "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", 或 "Sun" 之一 (区分大小写)。

    <day>

    2位数字表示天数,例如, "04" 或 "23"。

    <month>

    "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec" 之一(区分大小写)。

    <year>

    4位数字表示年份,例如, "1990" 或 "2016"。

    <hour>

    2位数字表示小时数,例如, "09" 或 "23"。

    <minute>

    2位数字表示分钟数,例如, "04" 或 "59"。

    <second>

    2位数字表示秒数,例如, "04" 或 "59"。

    GMT

    格林尼治标准时间。 在HTTP协议中,时间都是用格林尼治标准时间来表示的,而不是本地时间。

    Content-Type:application/json; charset=utf-8: 说明实体内对象的媒体类型。

    HTTP响应头是资源的特定版本的标识符。这可以让缓存更高效,并节省带宽,因为如果内容没有改变,Web服务器不需要发送完整的响应。而如果内容发生了变化,使用ETag有助于防止资源的同时更新相互覆盖(“空中碰撞”)。

    ETag:如果给定URL中的资源更改,则一定要生成新的Etag值。 因此Etags类似于指纹,也可能被某些服务器用于跟踪。 比较etags能快速确定此资源是否变化,但也可能被跟踪服务器永久存留。

    X-Powered-By: 3.2.1 : 这个查了半天没找到一个合理的解释,出于安全考虑一般会隐藏,不过使用express会自动暴露,于是就手动修改:

    默认:

    默认暴露我们使用的框架是express

    这样隐藏掉:

     res.header("X-Powered-By", ' 3.2.1')

    想了解更多精彩的你:

     

     

     

     

     

     

     

     

     

    展开全文
  • localhost:8080

    千次阅读 2019-05-21 11:54:00
    本地发布(localhost:8080)的web项目如何让其他主机访问? 本地localhost:8080的java web项目,在没有部署到服务器的情况下,如何让另一台主机访问自己本地的项目呢?请看下面详解! 上学期做的一个java web ...

    本地发布(localhost:8080)的web项目如何让其他主机访问?

    本地localhost:8080的java web项目,在没有部署到服务器的情况下,如何让另一台主机访问自己本地的项目呢?请看下面详解!

    上学期做的一个java web 项目,这学期软件测试课程需要测试。但是上学期租的服务器早过期了。又想把这个项目分享给小伙伴看看,所以就想:自己本地的项目能不能让另外一个小伙伴在他电脑上看看。最后成功了,具体步骤见下:

    1. 首先确保本地可以访问
    2. 关闭本机防火墙

    右键“我的电脑”-> 左上方“控制面板主页” -> 找到“Windows Defender 防护墙” -> 点击“启用或关闭Windows Defender 防护墙”

    1. 打开手机热点,让自己的电脑和你想让他访问你项目的电脑或者手机连上热点,即出于同一个局域网之中。

    2. 查找本机ip

    Windows+R ->输入cmd

    1. 访问http://10.63.88.94:8080/login 就可以访问啦~~~

    写在结尾的话:可能还有很多其他更好更安全的方法,但是本人一下子第一次就亲测有用的就是这个方法,所以也没有再尝试其他的方法。哈哈,记录一下防止忘记,也可以分享给大家,毕竟好记性不如烂笔头嘛~~~

    展开全文
  • localhost:8080localhost:8080/项目名分别是哪种路径,项目根目录还是web应用根目录, forward与redirect中的/又是代表什么路径呢?
  • 问题描述:因为node服务运行在localhost:3000端口,vue运行在localhost:8080端口,不同端口存在跨域问题。 所以我使用了反向代理处理。 在vue.config.js里: proxy:{ '/api2':{ target:'http://localhost:3000', ...

    昨天遇到了这个问题(如标题),查了很多资料都没有解决,最后终于解决了,记录一下。

    问题描述:因为node服务运行在localhost:3000端口,vue运行在localhost:8080端口,不同端口存在跨域问题。
    所以我使用了反向代理处理。
    在vue.config.js里:

    proxy:{
        '/api2':{
            target:'http://localhost:3000', 
            changeOrigin:true, 
        }
    }
    

    我这里是vue-cli3,所以是vue.config.js,如果是vue-cli2,就在config文件夹里的index.js里面。

    在发送axios后,

    toLogin(){
        this.axios.post('/api2/users/login',{
            username:this.username,
            password:this.password
        }).then((res)=>{
            console.log(res);
        }).catch((res) => {
            alert("错误:" + res);
        });
    }
    

    出现了这样的问题。
    在这里插入图片描述

    在network里面看

    Proxy error: Could not proxy request /api2/users/login from localhost:8080 to localhost:3000 (ENOTFOUND).
    

    解决:
    1.在前端部分的项目目录里面,找到配置文件package.json
    本来是这样:

    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build"
    },
    

    给它加上start和server:

    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build",
        "start": "node index.js",
        "server": "nodemon index.js --ignore client"
    },
    

    问题解决了。
    在这里插入图片描述

    导致这个问题也有可能是路径的问题

    • proxy代理部分:
    proxy:{
        '/api2':{   //1
            target:'http://localhost:3000',   //2
            changeOrigin:true, 
        }
    }
    

    1.这里路径要注意
    2.这里在mac和windows上写法不一样
    windows:

    "target": "localhost:3000"
    

    mac:

    "target": "http://127.0.0.1:3000"
    
    • 发送axios部分:
    this.axios.post('/api2/users/login'
    

    /api2这个地方也要注意拼接得对不对

    展开全文
  • 问题描述:因为node服务运行在localhost:3000端口,vue运行在localhost:8080端口,不同端口存在跨域问题。 所以我使用了反向代理处理。 在vue.config.js里: proxy:{ '/api2':{ target:'http://localhost:3000', ...

    问题描述:因为node服务运行在localhost:3000端口,vue运行在localhost:8080端口,不同端口存在跨域问题。
    所以我使用了反向代理处理。
    在vue.config.js里:

    proxy:{
        '/api2':{
            target:'http://localhost:3000', 
            changeOrigin:true, 
        }
    }
    

    我这里是vue-cli3,所以是vue.config.js,如果是vue-cli2,就在config文件夹里的index.js里面。

    在发送axios后,

    toLogin(){
        this.axios.post('/api2/users/login',{
            username:this.username,
            password:this.password
        }).then((res)=>{
            console.log(res);
        }).catch((res) => {
            alert("错误:" + res);
        });
    }
    

    出现了这样的问题。

    在network里面看

    Proxy error: Could not proxy request /api2/users/login from localhost:8080 to localhost:3000 (ENOTFOUND).
    1
    解决:
    1.在前端部分的项目目录里面,找到配置文件package.json
    本来是这样:

    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build"
    },
    

    给它加上start和server:

    "scripts": {
        "serve": "vue-cli-service serve",
        "build": "vue-cli-service build",
        "start": "node index.js",
        "server": "nodemon index.js --ignore client"
    },
    

    问题解决了。

    导致这个问题也有可能是路径的问题

    proxy代理部分:

    proxy:{
        '/api2':{   //1
            target:'http://localhost:3000',   //2
            changeOrigin:true, 
        }
    }
    

    1.这里路径要注意
    2.这里在mac和windows上写法不一样
    windows:

    "target": "localhost:3000"
    

    mac:

    "target": "http://127.0.0.1:3000"
    

    发送axios部分:

    this.axios.post('/api2/users/login'
    

    /api2这个地方也要注意拼接得对不对

    原文链接:https://blog.csdn.net/reagan_/article/details/97498160

    展开全文
  • http://localhost:8080/user/login 登录失败,重新定向,再登录请求路径改为 http://localhost:8080/user/user/login 分析 <form action="user/login" method="post"> 用户名:<input type="text" name=...
  • Jenkins用tomcat8容器启动后,可以打开localhost:8080,但是打不开localhost:8080/jenkins 经查是因为webapp内有一个ROOT文件夹,删掉就好了。 欢迎使用Markdown编辑器 你好! 这是你第一次使用 Markdown编辑器 所...
  • Proxy error: Could not proxy request /getInfo from localhost:81 to http://localhost:8080/. 项目启动时,我的登录界面验证码出现报错无法显示。 Proxy error: Could not proxy request /api/ from localhost:...
  • I have big problems installing Solr 4.3 under Ubuntu 12.04. Firstly i installed tomcat. I can access tomcat via browser on localhost:8080. Into "Tomcat Web Application Manager" i try to install Solr 4
  • 解决方案: 1.在被请求的php文件中加入请求头部 header('Access-Control-Allow-Origin: *'); <?php header('Access-Control-Allow-Origin: *'); $arr = [ array('id'=>... echo json_encod...
  • vue 项目用 axios 进行请求的时候,总是报“Access to XMLHttpRequest at ‘http://localhost:8080/api/login’ from origin ‘http://localhost:8080……’”的错误 这属于跨域问题 解决方法: 找到项目的 config ...
  • 安装tomcat后配置好了环境变量,点击startup.bat能成功启动,但是在浏览器输入127.0.0.1:8080”或者“localhost:8080”都出现404 NOT FOUND。 查看了端口占用情况: 发现端口被PID 是7528的进程占用了。 用了...
  • 8080被占用,localhost:8080不能访问/local host:8080/hello不能访问 1、搜索中打开cmd 2、在命令行输入netstat -aon|findstr “8080”(-前“前有空格)端口号为8080,查看PID,以下PID为7244 3、打开任务管理器...
  • from origin 'http://localhost:8080' has been blocked by CORS policy 2.问题分析 CORS跨域访问错误 3.问题解决 编写一个配置类 package com.demo.config; import org.springframework.context.annotation....
  • package.json写了“proxy”:"http://localhost:8080" 下面是App.js里component StaffList.js代码,cnpm start后console显示异常: Proxy error: Could not proxy request /api/staffs from localhost:3000 to ...
  • tomcat能启动但是访问http://localhost:8080时访问不了

    万次阅读 多人点赞 2018-05-31 22:28:23
    但是无法访问http://localhost:8080,开始查找原因·首先确定自己java环境变量配置好了。配置如下:JAVA_HOMEH:\Java\jdk==================================CLASSPATH.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\t...
  • 用火狐调试PHP时 偶尔会出现连接被重置的情况:http://localhost:8080自动跳转到http://www.localhost.com:8080 解决方案1: 打开网络-属性,往下拉找到Internet协议版本6然后点击属性。然后换成自动获得地址 ...
  • SpringBoot启动访问localhost:8080报错404

    千次阅读 2020-03-11 10:26:45
    1、确定本地网络是通的: 2、确定SpringBootq启动后是不报错的 ...如果加入了项目路径的话,直接访问localhost:8080是不会到欢迎页面的,需要加上项目路径才能访问到欢迎页面,即localhost:8080/sell ...
  • 阿里云服务器的tomcat只能使用(localhost:8080)访问而不能用(服务器ip:8080)访问 如下图所示: 向安全组中添加规则,使得8080端口能被访问
  • http://localhost:8080/day/hello http:// 表示http协议 localhost: 表示服务器ip 8080 表示端口号 /day 表示工程路径, /hello 表示资源路径 localhost: 作用: 通过服务器的地址,就可以定位访问网络中的哪...
  • 求救
  • 自述:本来项目可以启动,今天来启动不了,在run 上面提示:Address localhost:8080 is already in used 》 地址localhost:8080已经被使用 解决方法, 1.打开CDM 2.输入netstat -ano | findstr “8080” 3.回车,会...
  • 浏览器访问http://localhost:8080, 提示404

    万次阅读 2018-01-06 16:53:38
    操作:sh ./startup.sh启动tomcat服务器,浏览器地址栏输入http://localhost:8080 结果:网页提示404无法找到页面,但是我的tomcat目录中确实有ROOT项目 解决方法:查看8080端口占用情况lsof -i : 8080, 将所有...
  • 在Eclipse里面配置了tomcat,启动tomcat,浏览器访问localhost:8080/xxxx,结果,页面显示无法正常打开,localhost 将您重定向的次数过多。这是什么情况呢?用tomcat里面的startup.bat打开,再访问localhost:8080/...
  • 有时候运行web项目的时候会遇到 Error running Tomcat8: Address localhost:8080 is already in use 的错误,导致web项目无法运行。这明显是8080端口已经被占用,解决办法如下:第一步,命令提示符号,执行命令:...
  • 项目的编译项目都在Tomcat的webapps下,项目的访问路径一般为:http://localhost:8080/项目虚拟路径。但是Tomcat的默认访问页面http://localhost:8080访问到的是Tomcat带猫的的那个页面,要想直接输入本地地址...
  • tomcat正常启动后http://localhost:8080/报错404

    万次阅读 多人点赞 2016-08-11 18:18:33
    症状: tomcat在eclipse里面能正常启动,而在浏览器中访问http://localhost:8080/不能访问,且报404错误。同时其他项目页面也不能访问。...访问htt://localhost:8080/能正常访问tomcat管理页面。 症状原因:  e
  • 出现该问题应该是,许多安装教程点击 然后进行localhost:8080访问,出现了 解决方法很简单 重新打开 ,千万不要关闭 接下来你试试访问localhost:8080看看是否解决
  • 服务器的日志文件中监听的端口是80但是访问的地址是http://localhost:8080,然后访问显示 请确保web地址http://localhost:8080正确
  • http://localhost:8080/ 无法访问

    千次阅读 2019-10-25 15:29:10
    当http://localhost:8080/ 无法访问,出现以下情况时 解决方案: 打开【控制面板】——【系统和安全】——【Windows防火墙】 点击【打开或关闭Windows防火墙】然后选择【关闭Windows防火墙】 就可以正常访问了 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 36,461
精华内容 14,584
关键字:

localhost:8080