Django implements a photo management system 01

Source: Internet
Author: User

Some days did not write notes, O (∩_∩) o haha ~ really is belly no ink! Don't write data structure today! How to miss the date of research data Structure!

But then! Recently there is a project to engage in image management, the specific content will not say! We are here today to implement a simple album management system!

The system used is Linux ubuntu;python2.7;d Jango version can be queried in the following ways;

Mine is 1.8.1 is the newest now!

All right! Look at the task we are going to accomplish;

1) realize the function of uploading images;

2) in the image management interface to display the name of each image, as well as thumbnail images;

Simply put, Django has done most of the work for us, and what we need to write is very simple;

Solution

1) Create the project;

django-admin.py Startproject MyProject

2) Enter the project

CD MyProject

3) Create an app

django-admin.py Startapp MyApp

4) Check your current directory is not like the following;

All right! The project has been created, configuration configuration is complete! Don't mention the configuration is afraid! (I was annoyed when I used to configure Apache)

1) Enter the MyProject directory of the inner layer

CD MyProject

2) Edit the settings.py file (you need to change two places at present)

Note that we keep in formation with other content: D after adding myapp; because we need to upload files, we need to disable CSRF temporarily.

All right! Configuration is complete! We can go into MyApp and write something that we want to achieve.

1) Open models.py with vim

2) Execute makemigrations command

3) Execute Migrate command

4) Execute SYNCDB command (also select Create Admin user)

5) All right! You can run the server after everything is done.

6) Enter 127.0.0.1:8000/admin/URL;

All right! This process from the model to show on the website is too fast! You can have a rest and think for a moment;

And, try to test if the image can be uploaded? Ask yourself where the image will be uploaded.

Can you now see the thumbnail representation of the image?

Click on the + sign, add a picture to see it;

Don't be surprised at the result! See if the following results are the same as yours?

We do not see the appearance of thumbnails. Now we solve it;

1) I need a way to return an HTML statement, using HTML to display the image;

It looks image_path strange, but leave it alone, and we'll know what it is.

2) Register Our method attribute to the management module;

3) The following can be tested in the browser;

We get the result, really just a piece of HTML source code, we want it to display a picture of;

4) We found images/images/1414.jpg this address is a bit difficult to understand, in the end there is where AH;

Although we personally uploaded, but really do not know where it exists, so we naturally think of ourselves to define a dedicated location;

Vim settings.py

Media_root itself is a global variable, but the default value is empty, so we set ourselves a directory;

Note that Landpack is my username and you should replace it with your own user name such as Peter, etc.;

Check to see if you have created this directory.

5) We can now try the test again! This time we mainly upload a photo to see if he is honest to save to the designated location;

All right! The page shows that the upload was successful! Similarly, we checked the directory under the images directory with a 1414.jpg file. We upload successfully, save location to meet the specified requirements;

But what? Our page still does not show our picture, for save space, I will cut as small as possible to show the figure;

Looking closely you will find that the SRC address is not where our pictures are stored, so how can we display the pictures?

6) So now we're going to kill settings.py again. Set a variable called Media_url;

Now run the server program, if you have not stopped the Python mange.py runserver then please refresh the browser ha;

Still not show, this time you may have been worried! Should we think about the path or not?

Haha, correct it! Is the path is not right, you see this is not what we want to display the location of the picture;

7) Let's look at what we define in models.py;

The reason we found the mistake is that images is superfluous! We're going to remove him now.

Change to the following form, refresh the browser, the failure is still, I can't stand it, you know, in order to solve this problem, I am Google for three days;

We found that this position is indeed the one we set Media_url, the picture name is also right! Why can't you show it? Do you remember where we saved the pictures? How do we map this URL to the actual location of the images we have? At this time we think of the urls.py file;

8) First you need to know to let the URLs know that you are going to use the Media_root file defined in settings.py, of course patterns you should know its role;

The following is the completion of the mapping action;

9) Next, refresh the browser and find that the picture is still not displayed; I can't stand it. We continue to observe;

Find HTML Statements We write height=40 should be changed to height= "40" AH;

But after the change is still not good, it is only with the most simple method of violence!

The direct address is put on the browser to test;

The result of the first test is this;

Soon, we decided that the reason is the port number is wrong, we use 8000, where the address is not reflected;

Second Test;

The results are as follows;

Haha, I upload a lot of pictures! Sorry, but also in order to directly remember the future can be more clear;

10) Now we can take a step toward settings.py, modify the address of the Media_url plus the port number;

The result? is still not shown, this problem is nerve-racking, I have to reproduce these, because I really think this problem is more difficult, so record every step of the attempt;

You must be thinking of an HTML file, a python file, you can't stand it! Whether we can write separately;

Of course you can!!

First, we use a render_to_string function;

Open our models.py file;

So how do we introduce render_to_string?

All right! Now all we need is the Python code has been written, can rest assured to write HTML files

11) So first we need a place to save the HTML file, OK now we are in the MyApp directory;

Then you have to go into the templates and do it again.

Next is how to write our HTML file;

All right! Now we can finally test it.

All right! The result finally let us have happy up! But now you must think again, why is the writing just can't show the picture? You have to think about it yourself.

Finally, have to apologize, there is no copy of the code, all is;

There are two reasons:

First, I am writing on the virtual machine code, the blog written on the Mac, so cannot copy paste code;

Second, we still write their own more remember prison ah;

Django implements a photo management system 01

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.