এক্সপ্রেস-জেএস আমার স্থির ফাইলগুলি পেতে পারে না, কেন?


308

আমি তৈরি করতে পারার সবচেয়ে সহজ এক্সপ্রেস-জেএস অ্যাপ্লিকেশনটিতে আমি আমার কোড হ্রাস করেছি:

var express = require("express"),
    app = express.createServer();
app.use(express.static(__dirname + '/styles'));
app.listen(3001);

আমার ডিরেক্টরিটি দেখতে দেখতে:

static_file.js
/styles
  default.css

তবুও যখন আমি অ্যাক্সেস http://localhost:3001/styles/default.cssকরি তখন আমি নিম্নলিখিত ত্রুটিটি পাই:

Cannot GET / styles /
default.css

আমি ব্যবহার করছি express 2.3.3এবং node 0.4.7। আমি কি ভুল করছি?


উত্তর:


491

ব্যবহার করে দেখুন http://localhost:3001/default.css

আছে /stylesআপনার অনুরোধ URL- এ ব্যবহারে:

app.use("/styles", express.static(__dirname + '/styles'));

এই পৃষ্ঠায় উদাহরণগুলি দেখুন :

//Serve static content for the app from the "public" directory in the application directory.

    // GET /style.css etc
    app.use(express.static(__dirname + '/public'));

// Mount the middleware at "/static" to serve static content only when their request path is prefixed with "/static".

    // GET /static/style.css etc.
    app.use('/static', express.static(__dirname + '/public'));

42
ধন্যবাদ. নোড এবং এক্সপ্রেসে নতুন কেউ হিসাবে, এক্সপ্রেস ডকুমেন্টেশনগুলি স্কেচী মনে হয় যতক্ষণ না আপনি আবিষ্কার করেন যে মিডলওয়্যার ডকগুলি যেখানে সংযুক্ত রয়েছে।
নাট

4
হাঁ। এটি আমার ক্ষেত্রে অনুপস্থিত স্ল্যাশ ছিল ।
বরিশিয়াকুর

আমার ক্ষেত্রে আমি বুঝতে পারিনি যে মাউন্ট পাথটি সেই পথটিতে অন্তর্ভুক্ত ছিল যেমন আপনি দ্বিতীয় উদাহরণে ব্যাখ্যা করেছেন। ধন্যবাদ!
মাইক চিল

নতুন ইনস্টলের ক্ষেত্রে আপনার যাচাই করা উচিত যে আপনার এক্সপ্রেস মডিউলটি যথাযথভাবে ইনস্টল করা আছে ( এক্সপ্রেসস /en/starter/installing.html ) তবে আপনার গিয়াকোমোর মতো ডিরেক্টরি এবং আপনার ডিরেক্টরি নামটি পরীক্ষা করা উচিত;)
Spl2nky

path.joinক্রস প্ল্যাটফর্ম ডিরেক্টরি বিভাজক সমস্যাগুলি কাটিয়ে উঠতে সর্বদা ব্যবহার করুন । path.join (__ dirname, '/')
ডগ চেম্বারলাইন

35

আমি একই সমস্যা আছে। আমি নিম্নলিখিত কোড সহ সমস্যাটি সমাধান করেছি:

app.use('/img',express.static(path.join(__dirname, 'public/images')));
app.use('/js',express.static(path.join(__dirname, 'public/javascripts')));
app.use('/css',express.static(path.join(__dirname, 'public/stylesheets')));

স্থির অনুরোধ উদাহরণ:

http://pruebaexpress.lite.c9.io/js/socket.io.js

আমার আরও সহজ সমাধান দরকার। এটি কি বিদ্যমান?


আপনার সমাধানটি সর্বোত্তম কিনা তা বিবেচনা না করে ভাগ করার জন্য আপনাকে ধন্যবাদ। আপনি যদি অপটিমাইজেশনের জন্য সমস্যাটি আবার খুলতে চান তবে নতুন পরিস্থিতিতে বিশদ সম্পর্কিত একটি নতুন প্রশ্ন পোস্ট করার বিষয়টি বিবেচনা করুন। যদি অপ্টিমাইজেশনের একমাত্র উদ্দেশ্য হয় তবে প্রশ্নটি এসও কোড পর্যালোচনার পক্ষে আরও উপযুক্ত হতে পারে ।

15

default.css পাওয়া উচিত http://localhost:3001/default.css

stylesমধ্যে app.use(express.static(__dirname + '/styles'));মাত্র সন্ধান করার জন্য প্রকাশ বলে stylesসেবা করার জন্য একটি স্ট্যাটিক ফাইলের জন্য নির্দেশিকা। এটি (বিভ্রান্তিমূলকভাবে) এর পরে এটি যে পথটিতে পাওয়া যায় তার অংশ তৈরি করে না।


3
পুরোটাই! কোনটি express.js মধ্যে কনভেনশন দ্বারা হয় আপনি এটা করতে উপর /publicযা হয়েছে css, js, imgফোল্ডার তাই আপনি যা করতে পারেন http://localhost:3001/css/default.css:)
কিট Sunde

15

এই কাজটি আমার জন্য:

app.use('*/css',express.static('public/css'));
app.use('*/js',express.static('public/js'));
app.use('*/images',express.static('public/images'));

9

আপনার সার্ভার.জেজে:

var express   =     require("express");
var app       =     express();
app.use(express.static(__dirname + '/public'));

আপনি আলাদাভাবে এক্সপ্রেস এবং অ্যাপ্লিকেশন ঘোষণা করেছেন, 'সর্বজনীন' নামে একটি ফোল্ডার তৈরি করুন বা আপনার পছন্দ মতো করুন এবং তবুও আপনি এই ফোল্ডারে অ্যাক্সেস করতে পারবেন। আপনার টেম্পলেট src- এ, আপনি / সর্বজনীন (বা আপনার ফোল্ডারের নিয়তির নাম স্থিতিশীল ফাইলগুলিতে) থেকে আপেক্ষিক পাথ যুক্ত করেছেন। রুটে বারগুলি থেকে সাবধান থাকুন।


6

আমার জন্য যা কাজ করেছে তা হ'ল:

পরিবর্তে app.use(express.static(__dirname + 'public/images'));আপনার app.js লিখুন

সহজভাবে লিখুন app.use(express.static('public/images'));

অর্থাত্ পথের মূল ডিরেক্টরি নামটি সরান। এবং তারপরে আপনি স্থায়ী পথটি অন্য জেএস ফাইলগুলিতে কার্যকরভাবে ব্যবহার করতে পারেন, উদাহরণস্বরূপ:

<img src="/images/misc/background.jpg">

আশাকরি এটা সাহায্য করবে :)


এটি আমার সমস্যা সমাধান করেছে। আমার কোডে, সিএসএসে পাথটি __dirname কনকাটেনেশন (প্যাথ.জয়াইন ব্যবহার করে) দিয়েও দুর্দান্ত কাজ করছিল, যখন জেএস আনতে ব্যর্থ হয়েছিল।
চিম

আমি আনন্দিত যে এটি সাহায্য করেছে :)
আমির আসলাম

5

আমি আমার অ্যাপ্লিকেশনটিতে বুটস্ট্র্যাপ সিএসএস, জেএস এবং ফন্ট ব্যবহার করছি। আমি assetঅ্যাপ্লিকেশনটির মূল ডিরেক্টরিতে একটি ফোল্ডার তৈরি করেছি এবং এর মধ্যে এই সমস্ত ফোল্ডারটি রেখেছি । তারপরে সার্ভার ফাইলে নিম্নলিখিত লাইনটি যুক্ত করা হয়েছে:

app.use("/asset",express.static("asset"));

এই লাইন আমাকে যে ফাইল আছে লোড করতে সক্ষম assetথেকে ডিরেক্টরির /assetমত পথ উপসর্গ: http://localhost:3000/asset/css/bootstrap.min.css

এখন দর্শনে আমি নীচের মতো সিএসএস এবং জেএসকে কেবল অন্তর্ভুক্ত করতে পারি:

<link href="/asset/css/bootstrap.min.css" rel="stylesheet">

5

স্থির ফাইল (সিএসএস, চিত্র, জেএস ফাইল) কেবল দুটি ধাপ পরিবেশন করতে:

  1. মিডলওয়্যার এক্সপ্রেস.স্ট্যাটিকটিতে নির্মিত সিএসএস ফাইলের ডিরেক্টরিটি পাস করুন

    var express = require('express');
    var app = express();
    /*public is folder in my project directory contains three folders
    css,image,js
    */
    //css  =>folder contains css file
    //image=>folder contains images
    //js   =>folder contains javascript files
    app.use(express.static( 'public/css'));
  2. সিএসএস ফাইল বা চিত্রগুলিতে অ্যাক্সেস পেতে কেবল ইউআরএল টাইপ করুন http: // লোকালহস্ট: পোর্ট / ফাইলনাম সিএসএস প্রাক্তন: http: // লোকালহস্ট: 8081 / বুটস্ট্র্যাপ.সিএসএস

দ্রষ্টব্য: সিএসএস ফাইলগুলিতে এইচটিএমএল লিঙ্ক করতে কেবল টাইপ করুন<link href="file_name.css" rel="stylesheet">

যদি আমি এই কোডটি লিখি

var express = require('express');
var app = express();
app.use('/css',express.static( 'public/css'));

স্ট্যাটিক ফাইলগুলি অ্যাক্সেস করতে কেবল ইউআরএল টাইপ করুন: লোকালহোস্ট: পোর্ট / সিএসএস / ফাইলনাম সিএসএস প্রাক্তন: http: // লোকালহোস্ট: 8081 / সিএসএস / বুটস্ট্র্যাপ সিএসএস

এইচটিএমএল এর সাথে সিএসএস ফাইলগুলি লিঙ্ক করতে নোট করুন কেবল নীচের লাইনটি যুক্ত করুন

<link href="css/file_name.css" rel="stylesheet">    

3

এই আমার জন্য কাজ করে

app.use(express.static(path.join(__dirname, 'public')));

app.use('/img',express.static(path.join(__dirname, 'public/images')));

app.use('/shopping-cart/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

app.use('/shopping-cart/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/javascripts',express.static(path.join(__dirname, 'public/javascripts')));


1

আমি আমার সিএসএস ফাইলটি খুঁজে এটিতে একটি রুট যুক্ত করেছি:

app.get('/css/MyCSS.css', function(req, res){
  res.sendFile(__dirname + '/public/css/MyCSS.css');
});

তারপরে মনে হয় এটি কাজ করে।


এক্সপ্রেসজেএস .use()এবং express.static()পদ্ধতিগুলি আপনি যেখানে আপনার ফাইলগুলি পরিবেশন করছেন তা প্রেরণের জন্য ব্যবহার করা উচিত বলে আমি এই পদ্ধতির সুপারিশ করব না । অন্যথায় আপনার পাবলিক ডিরেক্টরিতে ফাইল প্রতি এই রাউটারগুলির মধ্যে একটি আপনার কাছে থাকবে এবং এটি বজায় রাখতে অনেকটাই ওভারহেড।
স্নাগল

এটি চারপাশের কাজ তবে আমি এটি যথাযথ বলে মনে করি না। আপনার যদি অনেকগুলি সিএসএস এবং জেএস ফাইল থাকে তবে আপনি কীভাবে এটি বজায় রাখতে পারবেন?
আরশো

0

উপরের পাশাপাশি, নিশ্চিত করুন যে মূল ডিরেক্টরি (/ প্রধান) এর উপরে যে কোনও ডিরেক্টরিতে স্থির ফাইলগুলি পরিবেশন করতে স্ট্যাটিক ফাইলের পথটি / (প্রাক্তন ... / সম্পদ / সিএসএস) দিয়ে শুরু হয় ...


2
উপরে কি যোগ? আপনার উত্তরে এটি বিবরণ দিন (যিনি এটি পোস্ট করেছেন তাকে ক্রেডিট দিন, যদি আপনার কাছে থাকে)। এসও প্রায়শই উত্তরগুলির ক্রম পরিবর্তন করে যাতে সমস্ত উত্তর প্রথম দেখা যায় না। আপনি কী বলছেন তা আমরা জানি না।
জ্যাকারি নিয়েবল

0

যদি আপনার সেটআপ

myApp
  |
  |__ public
  |     |
  |     |__  stylesheets
  |     |     |
  |     |     |__ style.css
  |     |
  |     |___ img
  |           |
  |           |__ logo.png
  |
  |__ app.js

তারপরে,
app.js এ দিন

app.use('/static', express.static('public'));

এবং আপনার স্টাইল। সিএসএস দেখুন: (কিছু .pug ফাইলে):

link(rel='stylesheet', href='/static/stylesheets/style.css')

আপনি কেন নাম পরিবর্তনের পদক্ষেপ জন - স্ট্যাটিকের সাথে পরিচিত করবেন? আমি এটি অতিরিক্ত তথ্য বিভ্রান্তিকর বলব। তবে তারপরে আবার
ইন্ডিरेশন

0
  1. নোডেজ প্রকল্প
    ফোল্ডারে 'পাবলিক' নামের একটি ফোল্ডার তৈরি করুন ।
  2. নোডেজ প্রকল্প ফোল্ডারের সূচী। Html ফাইলটি রাখুন।
  3. সমস্ত স্ক্রিপ্ট এবং সিএসএস ফাইল পাবলিক ফোল্ডারে রাখুন।
  4. ব্যবহার app.use( express.static('public'));

  5. এবং index.html স্ক্রিপ্ট সঠিক পথে<script type="text/javascript" src="/javasrc/example.js"></script>

এবং এখন সব কিছুই ঠিকঠাক কাজ করে।


0

স্ট্যাটিক ডিরেক্টরি

দির কাঠামোর জন্য উপরের চিত্রটি (স্ট্যাটিক ডিরেক্টরি) পরীক্ষা করুন

const publicDirectoryPath = path.join(__dirname,'../public')
app.use(express.static(publicDirectoryPath))


//  or

app.use("/", express.static(publicDirectoryPath))
app.use((req, res, next) => {
res.sendFile(path.join(publicDirectoryPath,'index.html'))
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.