Question

我正在尝试提交登录表单，因此每当我输入用户名和密码时，它都应将我重定向到首页，它只会弹出此错误消息

“混合内容：位于'https://plump-otter.glitch.me/'的页面已通过HTTPS加载，但请求了不安全的图标'http://glitch.com/favicon-app.ico'。此请求已被阻止；该内容必须通过HTTPS提供。”

我已尝试将URL更改为完整的https url，如错误消息中所示，但不起作用。.我包括了server.js文件和索引文件

'use strict';

const express     = require('express');
const bodyParser  = require('body-parser');
const fccTesting  = require('./freeCodeCamp/fcctesting.js');
const session = require('express-session');
const passport = require('passport');
const ObjectID = require('mongodb').ObjectID;
const mongo = require('mongodb').MongoClient();
const LocalStrategy = require('passport-local');


const app = express();

fccTesting(app); //For FCC testing purposes
app.use('/public', express.static(process.cwd() + '/public'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.set('view engine', 'pug')
app.use(session({

  secret: process.env.SESSION_SECRET,
  resave: true,
  saveUnintialized: true,

}));

app.use(passport.initialize());
app.use(passport.session());

mongo.connect(process.env.MONGO_URI, (err, db) => {
  if(err) {
    console.log('Database error: '+err);


  } else {

  console.log('Successful database connection');

  passport.serializeUser((user, done) => {
  done(null, user._id);

});




 passport.deserializeUser( (id, done) => {

  db.collection('users').findOne(

      {_id: new ObjectID(id)},
      (err, doc) => {

        done(null, doc);


      }
  );

});
    passport.use(new LocalStrategy(
      function(username, password, done) {
      db.collection('users').findOne({ username: username}, function(err, user) {
        console.log("User "+username +" attempted to log in.");
        if(err){return done(err);}
        if(!user){ return done(null, false);}
        if(password !== user.password) {return done(null, false); }
        return done(user, null);
  });
  }
));


  app.route('/')
   .get((req, res) => {


    res.render(process.cwd() + '/views/pug/index', {title: 'Hello',message: 'Please login', showLogin: true});
  });
    app.route('/login')
    .post(passport.authenticate('local', {failureRedirect: '/'}),
     function(req, res) {


    res.redirect('/profile');

    });

    app.route('/profile')
    .get((req, res) => {
      res.render(process.cwd() + '/profile');

    });

    app.listen(process.env.PORT || 3000, () => {
  console.log("Listening on port " + process.env.PORT);

});

}});

我的索引文件

html
  head
    title FCC Advanced Node and Express
    meta(name='description', content='A cool thing made with HyperDev')
    link#favicon(rel='icon', href='https://hyperdev.com/favicon-app.ico', type='image/x-icon')
    meta(charset='utf-8')
    meta(http-equiv='X-UA-Compatible', content='IE=edge')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    link(rel='stylesheet', href='/public/style.css')
  body
    h1.border.center FCC Advanced Node and Express
    h2.center#pug-success-message
    | Looks like this page is being rendered from Pug into HTML!
    | {Home Page}
    p#pug-variable= message



    if showLogin
      hr
      p Login Form
      form(action='/login', method='post')
        div
          label Username:
          input(type='text', name='username')
        div
          label Password:
          input(type='password', name='password')
        div
          input(type='submit', value='Log In')

    if showRegistration
      hr
      p Registration Form
      form(action='/register', method='post')
        div
          label Username:
          input(type='text', name='username')
        div
          label Password:
          input(type='password', name='password')
        div
          input(type='submit', value='Register')


    script(src='https://code.jquery.com/jquery-2.2.1.min.js', integrity='sha256-gvQgAFzTH6trSrAWoH1iPo9Xc96QxSZ3feW6kem+O00=', crossorigin='anonymous')
    script(src='/public/client.js')

Answer 1

当我访问您的收藏夹图标的URL时，找不到该图像。但是，通过express提供图标图标的一种更好的方法是使用 express-favicon ，该图标可以在所有页面上提供图标图标，而无需在每个页面上都定义图标。要安装

npm install express-favicon

这就是在代码中使用它的方式。

var favicon = require('express-favicon');

app.use(favicon('...location of favicon here...'));

仅此而已，无需执行任何其他HTML工作。但请再次检查您的网站图标的网址

混合内容和不安全的图标

1 个答案: